// headers
@mixin title-font() {
  font-weight: 900;
  font-size: 4.5rem;
  line-height: 1;

  @include lg(font-size, 4.5rem);
  @include md(font-size, 4rem);
  @include sm(font-size, 3.0rem);
  @include xs(font-size, 2rem);
}

// sub headers
@mixin subtitle-font() {
  font-weight: 900;
  font-size: 4rem;
  line-height: 1;

  @include lg(font-size, 4rem);
  @include md(font-size, 3.5rem);
  @include sm(font-size, 2.5rem);
  @include xs(font-size, 2.0rem);
}

// text
@mixin text-font() {
  font-weight: normal;
  font-size: 1.2rem;

  @include lg(font-size, 1.2rem);
  @include md(font-size, 1.2rem);
  @include sm(font-size, 1.2rem);
  @include xs(font-size, 1.2rem);
}

// link
@mixin link-font() {
  font-weight: 600;
  font-size: 1.1rem;

  @include lg(font-size, 0.95rem);
  @include md(font-size, 0.925rem);
  @include sm(font-size, 0.9rem);
  @include xs(font-size, 0.875rem);
}

// button
@mixin button-font() {
  font-weight: 600;
  font-size: 1.2rem;

  @include lg(font-size, 1.2rem);
  @include md(font-size, 1.2rem);
  @include sm(font-size, 1.2rem);
  @include xs(font-size, 1.2rem);
}

// code
@mixin code-font() {
  font-weight: normal;
  font-size: 0.8rem;

  @include lg(font-size, 0.775rem);
  @include md(font-size, 0.75rem);
  @include sm(font-size, 0.725rem);
  @include xs(font-size, 0.7rem);
}
